<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>像素</title>
    <style>
        /*
        1、简介：屏幕是由发光的小点构成，这一个个小点就是像素
        2、分辨率：1920*1080 就是屏幕中小点的数量
        3、分类
        （1）物理像素：上述小点点
        （2）CSS像素：编写网页时，所用像素就是CSS像素
        4、显示：浏览器在显示网页时，需要将CSS像素转换为物理像素再呈现；默认情况下，PC端：一个CSS像素=一个物理像素
        5、视口(viewport)：
        （1）含义：屏幕中显示网页的区域；通过视口来观察CSS像素和物理像素的比值
        （2）可选值：
        默认情况下，视口宽度：1920px（CSS像素）  1920px（物理像素） 此时css像素和物理像素比值为1：1
        放大两倍，视口宽度：960px(CSS像素)、1920px(物理像素)  此时css像素和物理像素比值为1：2
       6、注意： 可以通过改变视口大小，来改变CSS像素比值

        */
    </style>
</head>
<body>
    
</body>
</html>